<template>
  <div>
    <el-row>
      <el-col :span="12">
        <LineChart :xData="xData" :yData="yData" title="折线图" style="height:500px;"></LineChart>
      </el-col>

      <el-col :span="12">
        <BarChart :xData="xData" :yData="yData" title="柱状图" style="height:500px;"></BarChart>
      </el-col>
    </el-row>

    <el-row>
      <el-col :span="12">
        <PieChart :data="pieData" title="饼图" style="height:500px;"></PieChart>
      </el-col>
      <el-col :span="12"></el-col>
    </el-row>
  </div>
</template>
<script>
import LineChart from "@/components/chart/LineChart";
import BarChart from "@/components/chart/BarChart";
import PieChart from "@/components/chart/PieChart";
export default {
  components: {
    LineChart,
    BarChart,
    PieChart
  },
  data() {
    return {
      xData: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"],
      yData: [820, 932, 901, 934, 1290, 1330, 1320],
      pieData: [
        { name: "Mon", value: "820" },
        { name: "Tue", value: "932" },
        { name: "Wed", value: "901" },
        { name: "Thu", value: "934" },
        { name: "Fri", value: "1290" },
        { name: "Sat", value: "1330" },
        { name: "Sun", value: "1320" }
      ]
    };
  },
  // 页面初始化加载
  created: function() {},
  // 页面初始化完毕加载
  mounted: function() {},
  methods: {}
};
</script>

<style>
</style>
